{% extends "auth_base.html" %}

{% block title %}登录 - 期末成绩登记统计分析系统{% endblock %}

{% block styles %}
<style>
  body {
    background: url("{{ url_for('static', filename='bg.jpg') }}") no-repeat center center fixed;
    background-size: cover;
    height: 100vh;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .login-container {
    background: rgba(255, 255, 255, 0.9);
    padding: 40px;
    border-radius: 15px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
    width: 90%;
    max-width: 400px;
  }

  .login-title {
    text-align: center;
    color: #333;
    font-size: 24px;
    margin-bottom: 30px;
  }

  .form-group {
    margin-bottom: 20px;
  }

  .form-group label {
    display: block;
    margin-bottom: 8px;
    color: #333;
  }

  .form-group input {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 16px;
  }

  .form-group input:focus {
    outline: none;
    border-color: #498AE8;
  }

  .btn-login {
    width: 100%;
    padding: 12px;
    background-color: #498AE8;
    color: white;
    border: none;
    border-radius: 5px;
    font-size: 16px;
    cursor: pointer;
    transition: background-color 0.3s;
  }

  .btn-login:hover {
    background-color: #3a7bd5;
  }

  .register-link {
    text-align: center;
    margin-top: 20px;
  }

  .register-link a {
    color: #498AE8;
    text-decoration: none;
  }

  .register-link a:hover {
    text-decoration: underline;
  }

  .flash-messages {
    margin-bottom: 20px;
  }

  .flash-message {
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 10px;
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
  }
</style>
{% endblock %}

{% block content %}
<div class="login-container">
  <h1 class="login-title">登录</h1>

  {% with messages = get_flashed_messages() %}
  {% if messages %}
  <div class="flash-messages">
    {% for message in messages %}
    <div class="flash-message">{{ message }}</div>
    {% endfor %}
  </div>
  {% endif %}
  {% endwith %}

  <form method="POST" action="{{ url_for('auth.login') }}">
    {{ form.csrf_token }}
    <div class="form-group">
      {{ form.username.label }}
      {{ form.username(class="form-control", value="10250101") }}
      {% if form.username.errors %}
      {% for error in form.username.errors %}
      <span class="error">{{ error }}</span>
      {% endfor %}
      {% endif %}
    </div>
    <div class="form-group">
      {{ form.password.label }}
      {{ form.password(class="form-control", value="123") }}
      {% if form.password.errors %}
      {% for error in form.password.errors %}
      <span class="error">{{ error }}</span>
      {% endfor %}
      {% endif %}
    </div>
    {{ form.submit(class="btn-login") }}
  </form>
  <div class="register-link">
    还没有账号？<a href="{{ url_for('auth.register') }}">立即注册</a>
  </div>
</div>
{% endblock %}